<template>
    <div>
      <k-form-build
        :value="jsonData"
        ref="KFB"
        :disabled="disabled"
        class="doForm-detail"
      />
    </div>
</template>

<script>
  import {postAction, putAction} from '@/api/manage'
  import {getBpmForm, getBpmFormData} from '@/api/api'

  export default {
    name: 'FormView',
    props: {
      formId: {
        type: String,
        required: true
      },
      dataId: {
        type: String,
        required: false
      },
      disabled: {
        type: Boolean,
        required: false
      }
    },
    data() {
      return {
        param: {},
        tableId: "",
        bpmFormId: "",
        model: {},
        jsonData: {}
      }
    },
    mounted() {
      this.init();
    },
    methods: {
      init() {
        var formId = this.formId;
        var dataId = this.dataId;
        this.view({
          formId: formId,
          dataId: dataId,
        })
      },

      view(param) {
        let that = this;
        that.param = Object.assign({}, param);
        that.$nextTick(() => {
          that.initFormView(that.param.formId);
          that.initFormData(that.param.dataId, that.param.formId);
        });
      },
      initFormView(formId) {
        getBpmForm({
          id: formId
        }).then((res) => {
          let jsonData = res.result.html;
          this.tableId = res.result.tableId;
          this.bpmFormId=res.result.id;
          if (jsonData) {
            let jData = JSON.parse(jsonData);
            this.jsonData = jData;
          }
        })
      },
      initFormData(dataId, formId) {
        console.log(dataId)
        if(dataId){
          let that = this;
          getBpmFormData({
            dataId: dataId,
            formId: formId
          }).then((res) => {
            const oldData = res.result;
            if (oldData) {
              that.model = oldData;
              this.$refs.KFB.setData(oldData)
            }
          })
        }
      },
      setUserNames(userNames){
        this.model.userNames = userNames
      },
      saveForm() {
        this.$refs.KFB.getData().then(res => {
          let formData = Object.assign(this.model, res);
          this.submitForm(formData)
        }).catch(err => {
          console.log(err, '校验失败')
        })
      },

      submitForm(formData) {
        var that = this;
        var dataId = that.param.dataId;
        var tableId = that.tableId;
        var url = "/online/cgform/api/customForm/" + that.bpmFormId + "?tabletype=1";
        if (dataId) {
          putAction(url, formData).then((res) => {
            if (res.success) {
              formData.isNew=false;
              that.$emit('saveCallback', formData);
            } else {
              that.$message.warning(res.message);
            }
          }).finally(() => {
            console.log("更新成功")
          })
        } else {
          postAction(url, formData).then((res) => {
            if (res.success) {
              var id =res.result
              formData.id=id;
              formData.isNew=true;
              that.$emit('saveCallback', formData);
            } else {
              that.$message.warning(res.message);
            }
          }).finally(() => {
            console.log("保存成功")
          })
        }
      },
    },
  }
</script>
<style lang="less" scoped>
  .form-detail{
    .grid-row{
      .ant-col-xxl-4{
        width: 33.33333333%;
      }
      .ant-col-xxl-18 {
        width: 50%;
      }
    }
  }
</style>